<template>
  <div class="column justify-center items-center">
    <template v-if="status==5">
      <q-icon size="24px" name="mdi-cloud-lock" style="color: #59B8F8" />
      <div style="font-size: 12px;color: #59B8F8">Private</div>
    </template>
    <template v-else-if="status==6">
      <q-icon size="24px" name="mdi-file-cloud" style="color: #F19D30" />
      <div style="font-size: 12px;color: #F19D30">Draft</div>
    </template>
    <template v-else-if="status==7">
      <q-icon size="24px" name="mdi-cloud-off-outline" style="color: #808080" />
      <div style="font-size: 12px;color: #808080">Unpublished</div>
    </template>
    <template v-else>
      <q-icon size="24px" name="mdi-cloud-check" style="color: #13C974" />
      <div style="font-size: 12px;color: #13C974">Published</div>
    </template>
  </div>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue';
export default defineComponent({
  props: {
    status: {
      type: Number,
      required: true,
    },
  },
  setup() {
    return {};
  },
});
</script>